// src/pages/Recommendations.js
import React, { useEffect, useState } from 'react';

function Recommendations({ userData }) {
  const [recipes, setRecipes] = useState([]);

  useEffect(() => {
    // 从后端获取推荐菜谱
    if (userData) {
      fetch('http://localhost:5000/api/submit', {
        method: 'POST',
        headers: {
          'Content-Type': 'application/json',
        },
        body: JSON.stringify(userData),
      })
        .then((response) => response.json())
        .then((data) => {
          setRecipes(data.recommendedRecipes);
        });
    }
  }, [userData]);

  if (!userData) {
    return <p>请返回首页填写信息。</p>;
  }

  return (
    <div className="App">
      <h1>推荐菜谱</h1>
      <div>
        {recipes.map((recipe, index) => (
          <div className="recipe" key={index}>
            <h3>{recipe.name}</h3>
            <p>{recipe.description}</p>
            <p>营养成分: {recipe.nutrition}</p>
          </div>
        ))}
      </div>
    </div>
  );
}

export default Recommendations;